<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<div class="container-fluid">

				<!-- BEGIN CHART PORTLETS-->

				<div class="row-fluid">

					<div class="span12">

						<!-- BEGIN BASIC CHART PORTLET-->

						<div class="portlet box yellow">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Basic Chart</div>

								<div class="tools">

									<a class="collapse" href="javascript:;"></a>

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

									<a class="remove" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div class="chart" id="chart_1" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; max-width: 197px; top: 278px; left: 17px; text-align: center;" class="flot-tick-label tickLabel">0.0</div><div style="position: absolute; max-width: 197px; top: 278px; left: 257px; text-align: center;" class="flot-tick-label tickLabel">π/2</div><div style="position: absolute; max-width: 197px; top: 278px; left: 501px; text-align: center;" class="flot-tick-label tickLabel">π</div><div style="position: absolute; max-width: 197px; top: 278px; left: 735px; text-align: center;" class="flot-tick-label tickLabel">3π/2</div></div><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; top: 263px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-2.0</div><div style="position: absolute; top: 230px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-1.5</div><div style="position: absolute; top: 197px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-1.0</div><div style="position: absolute; top: 164px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-0.5</div><div style="position: absolute; top: 132px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">0.0</div><div style="position: absolute; top: 99px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">0.5</div><div style="position: absolute; top: 66px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">1.0</div><div style="position: absolute; top: 33px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">1.5</div><div style="position: absolute; top: 0px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">2.0</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="legend"><div style="position: absolute; width: 47px; height: 66px; top: 15px; right: 14px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:15px;right:14px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(237,194,64);overflow:hidden"></div></div></td><td class="legendLabel">sin(x)</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(175,216,248);overflow:hidden"></div></div></td><td class="legendLabel">cos(x)</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(203,75,75);overflow:hidden"></div></div></td><td class="legendLabel">tan(x)</td></tr></tbody></table></div></div>

							</div>

						</div>

						<!-- END BASIC CHART PORTLET-->                 

						<!-- BEGIN TRACKING CURVES PORTLET-->

						<div class="portlet box green">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Tracking Curves</div>

								<div class="tools">

									<a class="collapse" href="javascript:;"></a>

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

									<a class="remove" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div class="chart" id="chart_3" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; max-width: 65px; top: 278px; left: 21px; text-align: center;" class="flot-tick-label tickLabel">0</div><div style="position: absolute; max-width: 65px; top: 278px; left: 89px; text-align: center;" class="flot-tick-label tickLabel">1</div><div style="position: absolute; max-width: 65px; top: 278px; left: 157px; text-align: center;" class="flot-tick-label tickLabel">2</div><div style="position: absolute; max-width: 65px; top: 278px; left: 226px; text-align: center;" class="flot-tick-label tickLabel">3</div><div style="position: absolute; max-width: 65px; top: 278px; left: 294px; text-align: center;" class="flot-tick-label tickLabel">4</div><div style="position: absolute; max-width: 65px; top: 278px; left: 362px; text-align: center;" class="flot-tick-label tickLabel">5</div><div style="position: absolute; max-width: 65px; top: 278px; left: 431px; text-align: center;" class="flot-tick-label tickLabel">6</div><div style="position: absolute; max-width: 65px; top: 278px; left: 499px; text-align: center;" class="flot-tick-label tickLabel">7</div><div style="position: absolute; max-width: 65px; top: 278px; left: 567px; text-align: center;" class="flot-tick-label tickLabel">8</div><div style="position: absolute; max-width: 65px; top: 278px; left: 636px; text-align: center;" class="flot-tick-label tickLabel">9</div><div style="position: absolute; max-width: 65px; top: 278px; left: 702px; text-align: center;" class="flot-tick-label tickLabel">10</div><div style="position: absolute; max-width: 65px; top: 278px; left: 770px; text-align: center;" class="flot-tick-label tickLabel">11</div><div style="position: absolute; max-width: 65px; top: 278px; left: 838px; text-align: center;" class="flot-tick-label tickLabel">12</div><div style="position: absolute; max-width: 65px; top: 278px; left: 907px; text-align: center;" class="flot-tick-label tickLabel">13</div></div><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; top: 241px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-1.0</div><div style="position: absolute; top: 186px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">-0.5</div><div style="position: absolute; top: 132px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">0.0</div><div style="position: absolute; top: 77px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">0.5</div><div style="position: absolute; top: 22px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">1.0</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="legend"><div style="position: absolute; width: 78px; height: 44px; top: 15px; right: 13px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:15px;right:13px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(237,194,64);overflow:hidden"></div></div></td><td class="legendLabel" style="width: 56px;">sin(x) = -0.00</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(175,216,248);overflow:hidden"></div></div></td><td class="legendLabel" style="width: 56px;">cos(x) = -0.00</td></tr></tbody></table></div></div>

							</div>

						</div>

						<!-- END TRACKING CURVES PORTLET-->

						<!-- BEGIN DYNAMIC CHART PORTLET-->

						<div class="portlet box blue">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Dynamic Chart</div>

								<div class="tools">

									<a class="collapse" href="javascript:;"></a>

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

									<a class="remove" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div class="chart" id="chart_4" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; top: 280px; left: 10px; text-align: right;" class="flot-tick-label tickLabel">0%</div><div style="position: absolute; top: 224px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">20%</div><div style="position: absolute; top: 168px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">40%</div><div style="position: absolute; top: 112px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">60%</div><div style="position: absolute; top: 56px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">80%</div><div style="position: absolute; top: 0px; left: 0px; text-align: right;" class="flot-tick-label tickLabel">100%</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas></div>

							</div>

						</div>

						<!-- END DYNAMIC CHART PORTLET-->

						<!-- BEGIN STACK CHART CONTROLS PORTLET-->

						<div class="portlet box yellow">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Stack Chart Controls</div>

								<div class="tools">

									<a class="collapse" href="javascript:;"></a>

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

									<a class="remove" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div style="height: 350px; padding: 0px; position: relative;" id="chart_5"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 350px;" width="988" height="350"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; max-width: 82px; top: 328px; left: 15px; text-align: center;" class="flot-tick-label tickLabel">0</div><div style="position: absolute; max-width: 82px; top: 328px; left: 105px; text-align: center;" class="flot-tick-label tickLabel">1</div><div style="position: absolute; max-width: 82px; top: 328px; left: 196px; text-align: center;" class="flot-tick-label tickLabel">2</div><div style="position: absolute; max-width: 82px; top: 328px; left: 287px; text-align: center;" class="flot-tick-label tickLabel">3</div><div style="position: absolute; max-width: 82px; top: 328px; left: 378px; text-align: center;" class="flot-tick-label tickLabel">4</div><div style="position: absolute; max-width: 82px; top: 328px; left: 469px; text-align: center;" class="flot-tick-label tickLabel">5</div><div style="position: absolute; max-width: 82px; top: 328px; left: 560px; text-align: center;" class="flot-tick-label tickLabel">6</div><div style="position: absolute; max-width: 82px; top: 328px; left: 650px; text-align: center;" class="flot-tick-label tickLabel">7</div><div style="position: absolute; max-width: 82px; top: 328px; left: 741px; text-align: center;" class="flot-tick-label tickLabel">8</div><div style="position: absolute; max-width: 82px; top: 328px; left: 832px; text-align: center;" class="flot-tick-label tickLabel">9</div><div style="position: absolute; max-width: 82px; top: 328px; left: 920px; text-align: center;" class="flot-tick-label tickLabel">10</div></div><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; top: 313px; left: 7px; text-align: right;" class="flot-tick-label tickLabel">0</div><div style="position: absolute; top: 250px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">10</div><div style="position: absolute; top: 188px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">20</div><div style="position: absolute; top: 125px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">30</div><div style="position: absolute; top: 63px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">40</div><div style="position: absolute; top: 0px; left: 2px; text-align: right;" class="flot-tick-label tickLabel">50</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 350px;" width="988" height="350"></canvas></div>

								<div class="btn-toolbar">

									<div class="btn-group stackControls">

										<input type="button" value="With stacking" class="btn blue">

										<input type="button" value="Without stacking" class="btn red">

									</div>

									<div class="space5"></div>

									<div class="btn-group graphControls">

										<input type="button" value="Bars" class="btn">

										<input type="button" value="Lines" class="btn">

										<input type="button" value="Lines with steps" class="btn">

									</div>

								</div>

							</div>

						</div>

						<!-- END STACK CHART CONTROLS PORTLET-->

						<!-- BEGIN INTERACTIVE CHART PORTLET-->

						<div class="portlet box red">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Interactive Chart</div>

								<div class="tools">

									<a class="collapse" href="javascript:;"></a>

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

									<a class="remove" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div class="chart" id="chart_2" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="flot-text" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);"><div class="flot-x-axis flot-x1-axis xAxis x1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; max-width: 61px; top: 280px; left: 51px; text-align: center;" class="flot-tick-label tickLabel">2</div><div style="position: absolute; max-width: 61px; top: 280px; left: 117px; text-align: center;" class="flot-tick-label tickLabel">4</div><div style="position: absolute; max-width: 61px; top: 280px; left: 183px; text-align: center;" class="flot-tick-label tickLabel">6</div><div style="position: absolute; max-width: 61px; top: 280px; left: 249px; text-align: center;" class="flot-tick-label tickLabel">8</div><div style="position: absolute; max-width: 61px; top: 280px; left: 313px; text-align: center;" class="flot-tick-label tickLabel">10</div><div style="position: absolute; max-width: 61px; top: 280px; left: 379px; text-align: center;" class="flot-tick-label tickLabel">12</div><div style="position: absolute; max-width: 61px; top: 280px; left: 445px; text-align: center;" class="flot-tick-label tickLabel">14</div><div style="position: absolute; max-width: 61px; top: 280px; left: 512px; text-align: center;" class="flot-tick-label tickLabel">16</div><div style="position: absolute; max-width: 61px; top: 280px; left: 578px; text-align: center;" class="flot-tick-label tickLabel">18</div><div style="position: absolute; max-width: 61px; top: 280px; left: 644px; text-align: center;" class="flot-tick-label tickLabel">20</div><div style="position: absolute; max-width: 61px; top: 280px; left: 710px; text-align: center;" class="flot-tick-label tickLabel">22</div><div style="position: absolute; max-width: 61px; top: 280px; left: 776px; text-align: center;" class="flot-tick-label tickLabel">24</div><div style="position: absolute; max-width: 61px; top: 280px; left: 843px; text-align: center;" class="flot-tick-label tickLabel">26</div><div style="position: absolute; max-width: 61px; top: 280px; left: 909px; text-align: center;" class="flot-tick-label tickLabel">28</div><div style="position: absolute; max-width: 61px; top: 280px; left: 975px; text-align: center;" class="flot-tick-label tickLabel">30</div></div><div class="flot-y-axis flot-y1-axis yAxis y1Axis" style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;"><div style="position: absolute; top: 265px; left: 10px; text-align: right;" class="flot-tick-label tickLabel">0</div><div style="position: absolute; top: 245px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">10</div><div style="position: absolute; top: 224px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">20</div><div style="position: absolute; top: 204px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">30</div><div style="position: absolute; top: 183px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">40</div><div style="position: absolute; top: 163px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">50</div><div style="position: absolute; top: 143px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">60</div><div style="position: absolute; top: 122px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">70</div><div style="position: absolute; top: 102px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">80</div><div style="position: absolute; top: 82px; left: 5px; text-align: right;" class="flot-tick-label tickLabel">90</div><div style="position: absolute; top: 61px; left: 0px; text-align: right;" class="flot-tick-label tickLabel">100</div><div style="position: absolute; top: 41px; left: 0px; text-align: right;" class="flot-tick-label tickLabel">110</div><div style="position: absolute; top: 20px; left: 0px; text-align: right;" class="flot-tick-label tickLabel">120</div><div style="position: absolute; top: 0px; left: 0px; text-align: right;" class="flot-tick-label tickLabel">130</div></div></div><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 988px; height: 300px;" width="988" height="300"></canvas><div class="legend"><div style="position: absolute; width: 77px; height: 44px; top: 15px; right: 13px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:15px;right:13px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(209,38,16);overflow:hidden"></div></div></td><td class="legendLabel">Unique Visits</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(55,183,243);overflow:hidden"></div></div></td><td class="legendLabel">Page Views</td></tr></tbody></table></div></div>

							</div>

						</div>

						<!-- END INTERACTIVE CHART PORTLET-->                 

					</div>

				</div>

				<!-- END CHART PORTLETS-->

				<!-- BEGIN PIE CHART PORTLET-->

				<div class="row-fluid">

					<div class="span6">

						<div class="portlet box yellow">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Default</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Default Pie with Legend.</h4>

								<div class="chart" id="pie_chart" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div class="legend"><div style="position: absolute; width: 51px; height: 110px; top: 5px; right: 5px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:5px;right:5px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(237,194,64);overflow:hidden"></div></div></td><td class="legendLabel">Series1</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(175,216,248);overflow:hidden"></div></div></td><td class="legendLabel">Series2</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(203,75,75);overflow:hidden"></div></div></td><td class="legendLabel">Series3</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(77,167,77);overflow:hidden"></div></div></td><td class="legendLabel">Series4</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(148,64,237);overflow:hidden"></div></div></td><td class="legendLabel">Series5</td></tr></tbody></table></div></div>

							</div>

						</div>

						<div class="portlet box purple">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph1</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Default Pie without Legend</h4>

								<div class="chart" id="pie_chart_1" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><span style="position: absolute; top: 14px; left: 277.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(237,194,64);">Series1<br>15%</div></span><span style="position: absolute; top: 144px; left: 346.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(175,216,248);">Series2<br>24%</div></span><span style="position: absolute; top: 255px; left: 200.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(203,75,75);">Series3<br>27%</div></span><span style="position: absolute; top: 106px; left: 91.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(77,167,77);">Series4<br>24%</div></span><span style="position: absolute; top: 6px; left: 178.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(148,64,237);">Series5<br>10%</div></span></div>

							</div>

						</div>

					</div>

					<div class="span6">

						<div class="portlet box blue">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph2</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Added a semi-transparent background to the labels and a custom labelFormatter function.</h4>

								<div class="chart" id="pie_chart_2" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div style="position: absolute; width: 35px; height: 44px; top: 14px; left: 276.5px; background-color: rgb(237, 194, 64); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 14px; left: 276.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 144px; left: 345.5px; background-color: rgb(175, 216, 248); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 144px; left: 345.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 255px; left: 199.5px; background-color: rgb(203, 75, 75); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 255px; left: 199.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 106px; left: 90.5px; background-color: rgb(77, 167, 77); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 106px; left: 90.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 6px; left: 177.5px; background-color: rgb(148, 64, 237); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 6px; left: 177.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

						<div class="portlet box red">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph3</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Slightly more transparent label backgrounds and adjusted the radius values to place them within the pie.</h4>

								<div class="chart" id="pie_chart_3" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div style="position: absolute; width: 35px; height: 44px; top: 28px; left: 268.5px; background-color: rgb(237, 194, 64); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 28px; left: 268.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 142px; left: 329.5px; background-color: rgb(175, 216, 248); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 142px; left: 329.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 239px; left: 201.5px; background-color: rgb(203, 75, 75); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 239px; left: 201.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 109px; left: 106.5px; background-color: rgb(77, 167, 77); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 109px; left: 106.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 21px; left: 182.5px; background-color: rgb(148, 64, 237); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 21px; left: 182.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

					</div>

				</div>

				<!-- END PIE CHART PORTLET-->

				<!-- BEGIN PIE CHART PORTLET-->

				<div class="row-fluid">

					<div class="span6">

						<div class="portlet box yellow">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph4</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Semi-transparent, black-colored label background.</h4>

								<div class="chart" id="pie_chart_4" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div style="position: absolute; width: 35px; height: 44px; top: 28px; left: 268.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 28px; left: 268.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 142px; left: 329.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 142px; left: 329.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 239px; left: 201.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 239px; left: 201.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 109px; left: 106.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 109px; left: 106.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 21px; left: 182.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 21px; left: 182.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

						<div class="portlet box purple">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph5</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Semi-transparent, black-colored label background placed at pie edge.</h4>

								<div class="chart" id="pie_chart_5" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div style="position: absolute; width: 35px; height: 44px; top: 28px; left: 268.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 28px; left: 268.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 142px; left: 329.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 142px; left: 329.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 239px; left: 201.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 239px; left: 201.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 109px; left: 106.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 109px; left: 106.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 21px; left: 182.5px; background-color: rgb(0, 0, 0); opacity: 0.5;" class="pieLabelBackground"></div><span style="position: absolute; top: 21px; left: 182.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

					</div>

					<div class="span6">

						<div class="portlet box blue">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph6</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Added a semi-transparent background to the labels and a custom labelFormatter function.</h4>

								<div class="chart" id="pie_chart_6" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><span style="position: absolute; top: 39px; left: 263.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><span style="position: absolute; top: 140px; left: 316.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><span style="position: absolute; top: 227px; left: 203.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><span style="position: absolute; top: 111px; left: 118.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><span style="position: absolute; top: 33px; left: 186.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

						<div class="portlet box red">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph7</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>Labels can be hidden if the slice is less than a given percentage of the pie (10% in this case).</h4>

								<div class="chart" id="pie_chart_7" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><span style="position: absolute; top: 14px; left: 277.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(237,194,64);">Series1<br>15%</div></span><span style="position: absolute; top: 144px; left: 346.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(175,216,248);">Series2<br>24%</div></span><span style="position: absolute; top: 255px; left: 200.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(203,75,75);">Series3<br>27%</div></span><span style="position: absolute; top: 106px; left: 91.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(77,167,77);">Series4<br>24%</div></span><span style="position: absolute; top: 6px; left: 178.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:x-small;text-align:center;padding:2px;color:rgb(148,64,237);">Series5<br>10%</div></span></div>

							</div>

						</div>

					</div>

				</div>

				<!-- END PIE CHART PORTLET-->

				<!-- BEGIN PIE CHART PORTLET-->

				<div class="row-fluid">

					<div class="span6">

						<div class="portlet box yellow">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph8</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>The radius can also be set to a specific size (even larger than the container itself).</h4>

								<div class="chart" id="pie_chart_8" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><span style="position: absolute; top: 14px; left: 276.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><span style="position: absolute; top: 144px; left: 345.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><span style="position: absolute; top: 255px; left: 199.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><span style="position: absolute; top: 106px; left: 90.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><span style="position: absolute; top: 6px; left: 177.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

						<div class="portlet box purple">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph9</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>SThe pie can be tilted at an angle.</h4>

								<div class="chart" id="pie_chart_9" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div style="position: absolute; width: 35px; height: 44px; top: 33.5px; left: 314.5px; background-color: rgb(237, 194, 64); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 33.5px; left: 314.5px;" id="pieLabel0" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series1<br>15%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 141px; left: 427.5px; background-color: rgb(175, 216, 248); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 141px; left: 427.5px;" id="pieLabel1" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series2<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 233px; left: 187.5px; background-color: rgb(203, 75, 75); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 233px; left: 187.5px;" id="pieLabel2" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series3<br>27%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 110px; left: 8.5px; background-color: rgb(77, 167, 77); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 110px; left: 8.5px;" id="pieLabel3" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series4<br>24%</div></span><div style="position: absolute; width: 35px; height: 44px; top: 27.5px; left: 150.5px; background-color: rgb(148, 64, 237); opacity: 0.8;" class="pieLabelBackground"></div><span style="position: absolute; top: 27.5px; left: 150.5px;" id="pieLabel4" class="pieLabel"><div style="font-size:8pt;text-align:center;padding:2px;color:white;">Series5<br>10%</div></span></div>

							</div>

						</div>

					</div>

					<div class="span6">

						<div class="portlet box blue">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph10</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>A donut hole can be added.</h4>

								<div class="chart" id="donut" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div class="legend"><div style="position: absolute; width: 51px; height: 110px; top: 5px; right: 5px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:5px;right:5px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(237,194,64);overflow:hidden"></div></div></td><td class="legendLabel">Series1</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(175,216,248);overflow:hidden"></div></div></td><td class="legendLabel">Series2</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(203,75,75);overflow:hidden"></div></div></td><td class="legendLabel">Series3</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(77,167,77);overflow:hidden"></div></div></td><td class="legendLabel">Series4</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(148,64,237);overflow:hidden"></div></div></td><td class="legendLabel">Series5</td></tr></tbody></table></div></div>

							</div>

						</div>

						<div class="portlet box red">

							<div class="portlet-title">

								<div class="caption"><i class="icon-reorder"></i>Graph11</div>

								<div class="tools">

									<a class="config" data-toggle="modal" href="#portlet-config"></a>

									<a class="reload" href="javascript:;"></a>

								</div>

							</div>

							<div class="portlet-body">

								<h4>The pie can be made interactive with hover and click events.</h4>

								<div class="chart" id="interactive" style="padding: 0px; position: relative;"><canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><canvas class="flot-overlay" style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 470px; height: 300px;" width="470" height="300"></canvas><div class="legend"><div style="position: absolute; width: 51px; height: 110px; top: 5px; right: 5px; background-color: rgb(255, 255, 255); opacity: 0.85;"> </div><table style="position:absolute;top:5px;right:5px;;font-size:smaller;color:#545454"><tbody><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(237,194,64);overflow:hidden"></div></div></td><td class="legendLabel">Series1</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(175,216,248);overflow:hidden"></div></div></td><td class="legendLabel">Series2</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(203,75,75);overflow:hidden"></div></div></td><td class="legendLabel">Series3</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(77,167,77);overflow:hidden"></div></div></td><td class="legendLabel">Series4</td></tr><tr><td class="legendColorBox"><div style="border:1px solid #ccc;padding:1px"><div style="width:4px;height:0;border:5px solid rgb(148,64,237);overflow:hidden"></div></div></td><td class="legendLabel">Series5</td></tr></tbody></table></div></div>

							</div>

						</div>

					</div>

				</div>

				<!-- END PIE CHART PORTLET-->

				<!-- END PAGE CONTENT-->

			</div>
<script src="${pageContext.request.contextPath}/wx/media/js/jquery.slimscroll.min.js" type="text/javascript"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.blockui.min.js" type="text/javascript"></script>  

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.cookie.min.js" type="text/javascript"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.uniform.min.js" type="text/javascript" ></script>
	
<script src="${pageContext.request.contextPath}/wx/media/js/jquery.flot.js"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.flot.resize.js"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.flot.pie.js"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.flot.stack.js"></script>

<script src="${pageContext.request.contextPath}/wx/media/js/jquery.flot.crosshair.js"></script>
<script src="${pageContext.request.contextPath}/wx/media/js/charts.js" type="text/javascript"></script>
<script>
	jQuery(document).ready(function() {       


		   Charts.init();

			   Charts.initCharts();

			   Charts.initPieCharts();

	

	});

	</script>
